<template></template>

<script setup>
import { inject, onMounted, onBeforeUnmount } from "vue";
const { map } = inject("mapScene");
let rqaId = null;
//进入当前组件实现地球自转
function spinGlobe() {
  let center = map.getCenter();
  center.lng += 0.1;
  map.setCenter(center);
  rqaId = requestAnimationFrame(spinGlobe);
}
onMounted(() => {
  map.setZoom(1);
  map.setCenter([114.3, 30.59]);
  map.setPitch(0);
  spinGlobe();
  //点击zoom控件 关闭地球自转的行为
  const zoom = document.querySelector(".l7-control-zoom ");
  zoom.onclick = function () {
    cancelAnimationFrame(rqaId);
  };
});
//离开当前组件取消地球自转
onBeforeUnmount(()=>{
  cancelAnimationFrame(rqaId);
})
</script>

<style lang="scss" scoped></style>
